@import url(../css/icons/style.css);
/* ======================================================================= */
/* IMPORTS
/* ======================================================================= */
/* ----- compass ----- */
/* ----- variables/mixins ----- */
/* ======================================================================= */
/* VARIABLES
/* ======================================================================= */
/* ----- fonts ----- */
/* ----- colors ----- */
/* lighter */
/* darker */
/* lighter */
/* darker */
/* ----- spacing ----- */
/* ----- misc. ----- */
/* ======================================================================= */
/* MIXINS
/* ======================================================================= */
/* ----- fonts ----- */
/* ----- icons ----- */
/* ----- helpers ----- */
/* ======================================================================= */
/* DISPLAY
/* ======================================================================= */
/* ----- base ----- */
.wb-block {
  display: block;
}

/* ======================================================================= */
/* DIVIDERS
/* ======================================================================= */
/* ----- margins ----- */
*[class*="wb-margin"] {
  display: block;
  width: 100%;
  height: 10px;
}

.wb-margin-2x {
  height: 20px;
}

.wb-margin-3x {
  height: 30px;
}

.wb-margin-4x {
  height: 40px;
}

.wb-margin-5x {
  height: 50px;
}

.wb-margin-6x {
  height: 60px;
}

.wb-margin-7x {
  height: 70px;
}

.wb-margin-8x {
  height: 80px;
}

.wb-margin-9x {
  height: 90px;
}

.wb-margin-10x {
  height: 100px;
}

/* ======================================================================= */
/* COLORS
/* ======================================================================= */
/* ----- margins ----- */
.wb-color {
  color: #ef4135;
}

.wb-white {
  color: white;
}

/* ----- typography ----- */
/* ======================================================================= */
/* BASE
/* ======================================================================= */
/* ----- general ----- */
body {
  font: normal normal 13px/20px "Open Sans", Arial, sans-serif;
  color: #444444;
  background: #fcfcfc;
}

/* ----- links ----- */
a {
  text-decoration: none;
  color: #ef4135;
}
a, a:before, a:after {
  -webkit-transition: color 150ms ease-out, background-color 150ms ease-out, border-color 150ms ease-out;
  -moz-transition: color 150ms ease-out, background-color 150ms ease-out, border-color 150ms ease-out;
  -o-transition: color 150ms ease-out, background-color 150ms ease-out, border-color 150ms ease-out;
  transition: color 150ms ease-out, background-color 150ms ease-out, border-color 150ms ease-out;
}
a:hover {
  text-decoration: none;
  color: #ff4d41;
}

/* ======================================================================= */
/* HEADING
/* ======================================================================= */
/* ----- base ----- */
h1, h2, h3, h4, h5, h6 {
  margin: 0 0 0.65em;
  font-family: "Open Sans Condensed", Arial, sans-serif;
  font-weight: 700;
  font-style: normal;
  text-transform: uppercase;
  color: #222222;
}
h1:only-child, h2:only-child, h3:only-child, h4:only-child, h5:only-child, h6:only-child {
  margin: 0;
}
h1.wb-light, h1 small, h2.wb-light, h2 small, h3.wb-light, h3 small, h4.wb-light, h4 small, h5.wb-light, h5 small, h6.wb-light, h6 small {
  font-weight: 300;
}
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
  font-size: 75%;
}
h1 small.wb-block, h2 small.wb-block, h3 small.wb-block, h4 small.wb-block, h5 small.wb-block, h6 small.wb-block {
  margin-top: 0.55em;
}

h1 {
  font-size: 2.77em;
}

h2 {
  font-size: 2.3em;
}

h3 {
  font-size: 1.84em;
}

h4 {
  font-size: 1.53em;
}

h5 {
  font-size: 1.38em;
}

h6 {
  font-size: 1.23em;
}

/* ----- elements ----- */
/* ======================================================================= */
/* SECTION
/* ======================================================================= */
/* ----- base ----- */
.wb-section {
  display: block;
  width: 100%;
  padding: 60px;
  background-color: #f3f3f3;
}

/* ----- types ----- */
.wb-section-light {
  background-color: white;
}

.wb-section-dark {
  background-color: #1d242c;
}
.wb-section-dark p, .wb-section-dark h1, .wb-section-dark h2, .wb-section-dark h3, .wb-section-dark h4, .wb-section-dark h5, .wb-section-dark h6, .wb-section-dark h1 small, .wb-section-dark h2 small, .wb-section-dark h3 small, .wb-section-dark h4 small, .wb-section-dark h5 small, .wb-section-dark h6 small {
  color: white;
}
.wb-section-dark h1 small, .wb-section-dark h2 small, .wb-section-dark h3 small, .wb-section-dark h4 small, .wb-section-dark h5 small, .wb-section-dark h6 small {
  color: #717883;
}

.wb-section-color {
  background-color: #ef4135;
}
.wb-section-color p, .wb-section-color h1, .wb-section-color h2, .wb-section-color h3, .wb-section-color h4, .wb-section-color h5, .wb-section-color h6, .wb-section-color h1 small, .wb-section-color h2 small, .wb-section-color h3 small, .wb-section-color h4 small, .wb-section-color h5 small, .wb-section-color h6 small {
  color: white;
}

/* ======================================================================= */
/* ICONS
/* ======================================================================= */
/* ----- sizes ----- */
*[class*="wb-icon-"] {
  font-size: 16px;
}

.wb-icon-tiny {
  font-size: 8px;
}

.wb-icon-small {
  font-size: 12px;
}

.wb-icon-2x {
  font-size: 32px;
}

.wb-icon-3x {
  font-size: 48px;
}

.wb-icon-4x {
  font-size: 64px;
}

.wb-icon-5x {
  font-size: 80px;
}

.wb-icon-6x {
  font-size: 96px;
}

.wb-icon-7x {
  font-size: 112px;
}

.wb-icon-8x {
  font-size: 128px;
}

.wb-icon-9x {
  font-size: 144px;
}

.wb-icon-10x {
  font-size: 160px;
}

/* ======================================================================= */
/* BUTTON
/* ======================================================================= */
.btn {
  font-family: "Open Sans Condensed", Arial, sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  -webkit-transition: color 150ms ease-out, background-color 150ms ease-out, border-color 150ms ease-out, box-shadow 150ms ease-out;
  -moz-transition: color 150ms ease-out, background-color 150ms ease-out, border-color 150ms ease-out, box-shadow 150ms ease-out;
  -o-transition: color 150ms ease-out, background-color 150ms ease-out, border-color 150ms ease-out, box-shadow 150ms ease-out;
  transition: color 150ms ease-out, background-color 150ms ease-out, border-color 150ms ease-out, box-shadow 150ms ease-out;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
}
.btn, .btn:hover {
  border-color: #e0e0e0;
}
.btn:active {
  -webkit-box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.25);
  -moz-box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.25);
  box-shadow: inset 0 2px 10px rgba(0, 0, 0, 0.25);
}
.btn:focus {
  outline: none;
}
.btn.btn-primary, .btn.btn-secondary, .btn.btn-success, .btn.btn-danger, .btn.btn-warning, .btn.btn-info, .btn.btn-dark, .btn.btn-color {
  border: none;
}

/* ----- icon ----- */
.btn > i, .btn > span {
  display: inline-block;
  vertical-align: middle;
}
.btn span + i,
.btn i + span {
  margin-left: 5px;
}

.btn-icon {
  padding: 0.6em;
}
.btn-icon i {
  display: block;
}

/* ----- emphasized ----- */
.btn-emphasized {
  padding: 0.85em 1em;
}

/* ----- secondary ----- */
.btn-secondary {
  color: #666666;
  background-color: #e0e0e0;
}

.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active, .btn-secondary.active, .open .dropdown-toggle.btn-secondary {
  color: #444444;
  background-color: #d6d6d6;
}

/* ----- color ----- */
.btn-color {
  color: white;
  background-color: #ef4135;
}

.btn-color:hover, .btn-color:focus, .btn-color:active, .btn-color.active, .open .dropdown-toggle.btn-color {
  color: white;
  background-color: #ff4d41;
}

/* ----- dark ----- */
.btn-dark {
  color: white;
  background-color: #13171d;
}

.btn-dark:hover, .btn-dark:focus, .btn-dark:active, .btn-dark.active, .open .dropdown-toggle.btn-dark {
  color: white;
  background-color: #0f1216;
}

/* ----- secondary ----- */
/* ----- base ----- */
/*
.btn-primary, .btn-secondary, .btn-success, .btn-danger, .btn-warning, .btn-info, .btn-dark, .btn-color{
	border: none;
} 

.btn-icon{
	padding: 0.6em;

	i{
		display: block;
	}
}

.btn-emphasized{
	padding: 0.85em 1em;
}



.btn-color{
	color: $mono_color_f;
	background-color: $primary_color_1;
}

.btn-color:hover, .btn-color:focus, .btn-color:active, .btn-color.active, .open .dropdown-toggle.btn-color{
	color: $mono_color_f;
	background-color: $primary_color_2;
}

.btn-dark{
	color: $mono_color_f;
	background-color: $secondary_color_2;
}

.btn-dark:hover, .btn-dark:focus, .btn-dark:active, .btn-dark.active, .open .dropdown-toggle.btn-dark{
	color: $mono_color_f;
	background-color: $secondary_color_3;
}

*/
/* ======================================================================= */
/* COLLAPSE
/* ======================================================================= */
/* ----- base ----- */
/* 
.panel,
.panel-group{
	border: 1px solid $border_color_2;
}

.panel,
.panel-heading,
.panel-body,
.panel-group .panel,
.panel-group .panel + .panel,
.panel-group .panel-heading + .panel-collapse .panel-body{
	margin: 0;
	border: none;
	@include border-radius(0);
	@include box-shadow(none);
}

.panel-group .panel + .panel .panel-heading a{
	border-top: 1px solid $secondary_color_1;

	&:hover{
		border-color: $primary_color_2;
	}
}

.panel-heading{
	padding: 0;

	a{
		position: relative;
		display: block;
		padding: 0 15px 0 20px;
		line-height: 40px;
		color: $mono_color_f;
		border-left: 3px solid $secondary_color_1;
		background-color: $secondary_color_2;

		&:hover{
			color: $mono_color_f;
			border-color: $primary_color_2;
			background-color: $primary_color_2;

			&:before{
				border-left-color: $primary_color_2;
			}
		}

		&:before{
			content: "";
			display: block;
			width: 0;
			height: 0;
			position: absolute;
			top: 50%;
			left: 0;
			margin-top: -5px;
			border: 5px solid transparent;
			border-left-color: $secondary_color_1;
		}
	}
} */
